【JS幼幼班】Step.06 基本語法：基本型別(string、symbol)

基本型別 4. string (字串)：

字串是用 2 個引號(單引號或雙引號都可以)包住的文字。
而引號內的文字內容和字數不限，甚至可以使用空格或任何符號。

//正確寫法
let str1 = 'I have 3 dogs, and my sister have 2 cats.';
let str2 = "中文 にほんご español English हिन्दी العربية português বাংলা ਪੰਜਾਬੀ 한국어";
let str3 = '12.345+-*/%~~';

如果字串裡面也要包含引號呢？必須要用不同引號互包。

//正確寫法
let str4 = "Don't worry be happy.";
console.log(str4);      // 回傳 Don't worry be happy.

let str5 = '我的名字是"難吸"，請多指教！';
console.log(str5);      // 回傳 我的名字是"難吸"，請多指教！

都是相同引號互包，就會出錯。

//錯誤寫法
let str6 = 'Don't worry be happy.';
console.log(str6);    // 回傳 錯誤 Uncaught SyntaxError: Unexpected identifier

let str7 = "我的名字是"難吸"，請多指教！";
console.log(str7);    // 回傳 錯誤 Uncaught SyntaxError: Unexpected identifier

如果一定要相同的引號互包呢？或是要使用多行字串呢？
就在內包的引號左邊加上反斜線 \，而且 \ 的後方不可出現任何東西(包含空格)，以及內包的引號只能使用單數個。

//正確寫法
let str8 = 'Don\'t worry be happy.';
console.log(str8);       // 回傳 Don't worry be happy.

let str9 = "我的名字是\"難吸，請多指教！";
console.log(str9);      // 回傳 Don't worry be happy.

如果內包的引號出現雙數個，就會出錯。

//錯誤寫法
let str10 = "我的名字是\"難吸"，請多指教！";
console.log(str10);      // 回傳 錯誤 Uncaught SyntaxError: Unexpected identifier

多行字串也是使用反斜線 \ 寫法：

let txt = '這是第一行 \
這是第二行 \
這是第三行';

若遇到單行內有多組的字串相連，或字串和非字串相連，則用加號 + 來連接：

let sayHello = '嗨！我叫難吸。' + '你呢？';
console.log(sayHello);      // 回傳 嗨！我叫難吸。你呢？

let myPets = 'I have ' + 2 + ' dogs.';
console.log(myPets);        // 回傳 I have 2 dogs.

基本型別 5. symbol (符號)：

symbol 符號為 ES6 新增的基本資料型別，它是用來表示獨一無二的屬性名。語法如下:

Symbol([description])

它最大的用法是用來定義 object 物件的「唯一」屬性名，以防止不會跟其他的屬性名產生衝突，括號內的 description 為可選參數或字串。

p.s：「物件 object」因尚未介紹，可先連結到下一篇了解一下什麼是物件 object。這裡「物件 object」解釋為多種屬性資料的集合列表。

看不太懂？那我們解釋白話點吧。

在ES6之前，object 物件的屬性名只能是字串，若不是字串則會被強制轉為字串。如果要幫一個物件添加新的屬性名，很容易會造成名稱衝突。例如：我想列表出朋友的一些資料，於是取了一個物件叫 myFriends，資料有年齡 age、關係 relationship、性別 sex：

let myFriends = {
  '小美' : {
      age: 35,
      relationship: 'my boy friend',
      sex: 'Male'
  },
  '小美' : {
      age: 28,
      relationship: 'friend',
      sex: 'Female'
  },
  '跳跳' : {
      age: 6,
      relationship: 'my dog',
      sex: 'Female'
  },
};

上面的寫法好陌生...沒關係！這裡只是介紹各個型別的作用，未來的篇幅會更詳細說明寫法，我們先了解就好，趕快回到主題。

咦？上方的程式裡，剛好有兩位朋友都叫小美，撞名了怎辦！

之前在第二篇的時候有教過使用 console.log() 指令寫入瀏覽器控制台，來檢查自己寫的程式碼有沒有問題。我們來測試看看結果吧！

console.log(myFriends);

可以發現小美的資料只剩下一位，而且是下面的那位，第一位小美不見了。代表屬性名相同的，後者會蓋掉前者的資料。這下可GG了，第一位怎麼讓它出現呢？兩個小美我都想要看到阿！

這時候 symbol 符號就是我們的救星了。由於每個 symbol 的值都是獨一無二、不相等的，所以用它來當作物件的屬性名稱，可以確保不會出現同名的屬性，而這個特性才能防止物件的屬性不會在其他地方被意外的覆蓋掉。

話不多說，趕快用 symbol 來拯救小美 1 號吧！順便 console.log 結果。

let myFriends = {
  [Symbol('小美')] : {
      age: 35,
      relationship: 'my boy friend',
      sex: 'Male'
  },
  [Symbol('小美')] : {
      age: 28,
      relationship: 'friend',
      sex: 'Female'
  },
  [Symbol('跳跳')] : {
      age: 6,
      relationship: 'my dog',
      sex: 'Female'
  },
};

console.log(myFriends);

這時候就可以看到兩位小美都完整的出現在名單裡面了，而且一個也不缺。